<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	template="/layout/templateAdministrador.xhtml">
	<ui:define name="body">
		<h:form id="form">
			<p:panel header="Mantenimiento de Servicios">
				<br />
				<div style="height: 28px;" align="right">
					<h:commandButton image="images/botton/back.png"
						action="#{mantenimientoProcesos.backToManProcesos}" ajax="false"
						immediate="true" title="Regresar a la página anterior"
						type="button" style="width: 29px; height: 29px;" />
				</div>
				<br />

				<table width="100%" align="center" border="0">
					<tr>
						<td
							style="background: #F5DDA6 url('imagenes/reglaParte1.png'); width: 22%; text-align: center; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; line-height: 15px;">
							<font color="#494949" face="Calibri" size="4"
							style="font-weight: bold;">Descripci&oacute;n del Servicio
						</font>
						</td>
						<td
							style="background: #F5DDA6 url('imagenes/reglaParte2.png'); width: 22%; text-align: center; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; line-height: 15px;">
							<font color="#494949" face="Calibri" size="4"
							style="font-weight: bold;">Flujo del Servicio </font>
						</td>
						<td
							style="background: #F9B140 url('imagenes/reglaParte1.png'); width: 22%; text-align: center; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; line-height: 15px;">
							<font color="#494949" face="Calibri" size="4"
							style="font-weight: bold;">Requisito del Servicio </font>
						</td>
						<td
							style="background: #F9B140 url('imagenes/reglaParte1.png'); width: 22%; text-align: center; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; line-height: 15px;">
							<font color="#494949" face="Calibri" size="4"
							style="font-weight: bold;">Reconsideraci&oacute;n y
								Apelaci&oacute;n </font>
						</td>
					</tr>
				</table>


				<br />

				<p:panel header="Flujo del Proceso">
					<br />
					<p:messages />
					<h:panelGrid columns="2" style="margin:0 auto;" border="0">
						<h:outputText value="Acción: " style="text-align: right;" />
						<h:panelGrid columns="4">
							<h:selectOneListbox size="1" id="flujoAccion"
								value="#{mantenimientoProcesos.idAccion}">
								<f:selectItems value="#{mantenimientoProcesos.lstAccion}"
									var="a" itemLabel="#{a.descripcion}" itemValue="#{a.idAccion}" />
								<p:ajax update="flujoUniOrg flujoSubIniOrg msjA numDias"
									process="flujoAccion" event="change"
									actionListener="#{mantenimientoProcesos.validarAccion}" />
							</h:selectOneListbox>
							<p:spacer width="10" />
							<h:outputText value="Número de días:" style="text-align: right;" />
							<h:inputText value="#{mantenimientoProcesos.numDiaUnidOrg}"
								id="numDias" maxlength="2" required="true" size="1"
								requiredMessage="Ingrese la cantidad de días" />
						</h:panelGrid>

						<h:outputText value="Unidad Gestión:" style="text-align: right;" />
						<h:panelGrid columns="1">
							<h:selectOneListbox value="#{mantenimientoProcesos.idUnidOrg}"
								size="1" id="flujoUniOrg">
								<f:selectItem
									itemLabel="--- Seleccione una Unidad de Gestión ----"
									itemValue="-1" />
								<f:selectItems
									value="#{mantenimientoProcesos.lstUnidadesGestion}" var="a"
									itemLabel="#{a.descripcion}" itemValue="#{a.idArea}" />
								<p:ajax update="flujoSubIniOrg msjA" process="flujoUniOrg"
									event="change"
									actionListener="#{mantenimientoProcesos.seleccionarUnidadGestion}" />
							</h:selectOneListbox>
						</h:panelGrid>

						<h:outputText value="Grupo de Trabajo:" style="text-align: right;" />
						<h:panelGrid columns="1">
							<h:selectOneListbox size="1" id="flujoSubIniOrg"
								value="#{mantenimientoProcesos.idSubUniOrg}">
								<f:selectItem itemLabel="--- Seleccione un Grupo de Trabajo ---"
									itemValue="-1" />
								<f:selectItems value="#{mantenimientoProcesos.lstGrupoTrabajo}"
									var="g" itemLabel="#{g.descripcion}" itemValue="#{g.idArea}" />

								<p:ajax update="flujoSubIniOrg msjA" process="flujoSubIniOrg"
									event="change"
									actionListener="#{mantenimientoProcesos.validadUsuariosSubUnidadOrganica}" />
							</h:selectOneListbox>
						</h:panelGrid>


						<p:commandButton
							title="Agregar Unidad Gestión o Grupo de Trabajo al flujo de procesos"
							actionListener="#{mantenimientoProcesos.agregar}"
							update="form:outPanelGrid msjA form:duracion"
							style="background: url('images/botton/add.png') no-repeat;
												background-position: center bottom; width: 24px; 
												height: 24px; border:0" />


					</h:panelGrid>
				</p:panel>
				<br />
				<br />

				<p:outputPanel id="outPanelGrid">
					<p:dataTable value="#{mantenimientoProcesos.lstFlujoProceso}"
						var="f" emptyMessage="No posee ningun flujo">
						<f:facet name="header">
							<h:outputText value="Flujo de Procesos" />
						</f:facet>

						<p:column style="text-align: center;" headerText="Unidad Gestión">
							<h:outputText value="#{f.descripcionUnidadGestion}" />
						</p:column>
						<p:column style="text-align: center;"
							headerText="Grupo de Trabajo">
							<h:outputText value="#{f.descripcionGrupoTrabajo}" />
						</p:column>
						<p:column style="text-align: center;" headerText="Número días">
							<h:outputText value="#{f.numDias}" />
						</p:column>
						<p:column style="text-align: center;" headerText="Acción">
							<h:outputText value="#{f.tbAccion.descripcion}" />
						</p:column>
						<p:column style="text-align: center;" headerText="Eliminar">
							<p:commandLink value="Eliminar" id="btnElimFluArea"
								process="@this" update="form:duracion form:outPanelGrid"
								actionListener="#{mantenimientoProcesos.eliminarFlujoProceso}">
								<f:param name="idFlujoTrabajo" value="#{f.tbArea.idArea}"
									id="idFlujoTrabajo" />
							</p:commandLink>
						</p:column>

						<f:facet name="footer">
							<h:outputText
								value="Deacuerdo a lo listado se realizará la secuencia de envio para cada area"
								style="font-size:xx-small" />
						</f:facet>
					</p:dataTable>
				</p:outputPanel>

				<h:panelGrid columns="3" style="margin: auto;">
					<p:commandButton value="Retroceder" style="width: 110px"
						ajax="false"
						action="#{mantenimientoProcesos.regresarRegistroServicio1}" />
					<p:commandButton value="Grabar" style="width: 110px" ajax="false"
						action="#{mantenimientoProcesos.registrarYModificarServicio}" />
					<p:commandButton value="Siguiente" style="width: 110px"
						ajax="false" action="#{mantenimientoProcesos.irRegistroServicio3}" />
				</h:panelGrid>

			</p:panel>
		</h:form>
	</ui:define>
</ui:composition>

